<!DOCTYPE html>
<html>
<head>
<div th:replace="common/common_resource :: common_css"></div>
<title th:text="${application.shop_name} +' | 员工维护'"></title>
<style type="text/css">
img {
	cursor: pointer;
	transition: all 0.6s;
}

img:hover {
	transform: scale(1.4);
}
</style>
</head>
<body class="hold-transition skin-blue sidebar-mini ">
	<div class="wrapper">
		<div th:replace="common/common_h5 :: loginAndLogout"></div>
		<div th:replace="common/common_h5 :: upload_image"></div>
		<div th:replace="common/common_h5 :: left_menu"></div>
		<div class="content-wrapper">
			<section class="content">
				<div class="row">
					<div class="col-xs-12">
						<div class="box">
							<div class="box-header">
								<div class="row">
									<div class="col-xs-4">
										<span>
											<button type="button" id="add_dep" class="btn  btn-warning " style="margin-bottom: 10px;" data-toggle="modal" data-target="#employee_add_and_update">
												<i class="fa fa-plus"></i>添加员工
											</button>
										</span>
										<div class="modal fade " id="employee_add_and_update" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
											<div class="modal-dialog ">
												<div class="modal-content">
													<div class="modal-header bg-blue">
														<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
														<h4 class="modal-title" id="myModalLabel">添加/修改员工</h4>
													</div>
													<div class="modal-body">
														<form role="form" id="employee_from" th:action="${#httpServletRequest.getContextPath()}+'/employee/insertAndUpdate'" method="post" enctype="multipart/form-data">
															<input type="hidden" name="menuUuid" value="720">
															<div class="box-body">
																<input type="hidden" value="" name="empUuid" id="empUuid" />
																<div class="row">
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="empUsername">用户名
																				<font style="color: red; size: 2">&nbsp;&nbsp; * </font>
																			</label>
																			<input type="text" class="form-control" name="empUsername" id="empUsername" placeholder="请输入用户名" />
																		</div>
																	</div>
																	<div class="col-xs-3 text-left">
																		<div class="form-group">
																			<label for="empName">姓名
																				<font style="color: red; size: 2">&nbsp;&nbsp; * </font>
																			</label>
																			<input type="text" class="form-control" name="empName" id="empName" placeholder="员工姓名" />
																		</div>
																	</div>
																	<div class="col-xs-3 text-left">
																		<label for="empGender">性别</label>
																		<div class="radio" id="radiodiv">
																			<label>
																				<input type="radio" name="empGender" id="emp_mgender" value="1" checked="checked" />男
																			</label>
																			<label>
																				<input type="radio" name="empGender" id="emp_wgender" value="0" />女
																			</label>
																		</div>
																	</div>
																</div>
																<div class="row">
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="depuuid">部门</label>
																			<select	class="form-control" name="depuuid" id="depuuid1">
																				<option value="-1" selected="selected">---请选择---</option>
																				<option
																					th:each="department,departmentStat : ${dList}"
																					th:value="${department.depUuid}"
																					th:text="${department.depName}"></option>
																			</select>
																		</div>
																	</div>
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label>学位</label>
																			<select class="form-control" name="empDegree" id="empDegree1">
																				<option value="-1" selected="selected">---请选择---</option>
																				<option value="大专">大专</option>
																				<option value="本科">本科</option>
																				<option value="研究生">研究生</option>
																				<option value="博士">博士</option>
																				<option value="博士后">博士后</option>
																			</select>
																		</div>
																	</div>
																</div>
																<div class="row">
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="emp_age">年龄</label>
																			<input type="number" class="form-control" name="empAge" id="empAge" value="20" placeholder="员工年龄" />
																		</div>
																	</div>
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="empTele">电话
																				<font style="color: red; size: 2">&nbsp;&nbsp; * </font>
																			</label>
																			<input type="text" class="form-control" name="empTele" id="empTele" placeholder="手机号" />
																		</div>
																	</div>
																</div>
																<div class="row">
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="empEmail">邮箱
																				<font style="color: red; size: 2">&nbsp;&nbsp; * </font>
																			</label>
																			<input type="email" class="form-control" name="empEmail" id="empEmail" placeholder="邮箱" />
																		</div>
																	</div>
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="emp_idcard">身份证号
																				<font style="color: red; size: 2">&nbsp;&nbsp; * </font>
																			</label>
																			<input type="text" class="form-control" name="empIdcard" id="empIdcard" placeholder="身份证号" />
																			<span style="font-size: medium; color: #9e0505"></span>
																		</div>
																	</div>
																</div>
																<div class="row">
																	<div class="col-xs-6 text-left">
																		<div class="form-group">
																			<label for="empAddress">当前住址
																				<font style="color: red; size: 2">&nbsp;&nbsp; * </font>
																			</label>
																			<input type="text" class="form-control" name="empAddress" id="empAddress" placeholder="当前住址" />
																		</div>
																	</div>
																	<div class="col-xs-6 text-left">
																		<label>生日</label>
																		<div class="input-group date">
																			<div class="input-group-addon">
																				<i class="fa fa-calendar"></i>
																			</div>
																			<input type="text" class="form-control pull-right datepicker" id="datepicker" name="empBirthday" />
																		</div>
																	</div>
																</div>
																<label class="">角色</label>
																<div class="form-group">
																	<label class="checkboxs" th:each="role,roleStat : ${rList}">
																		<div class="icheckbox_minimal-blue "aria-checked="false" aria-disabled="false" style="position: relative;">
																			<input type="checkbox" th:value="${role.roleUuid}" name="roleUuids" class="minimal" style="position: absolute; opacity: 0;" />
																		</div>
																		<span th:text="${role.roleName}"></span>
																	</label>
																</div>
															</div>
															<div class="modal-footer">
																<div class="row">
																	<div class="col-xs-6 text-center">
																		<button type="reset" class="btn btn-warning" data-dismiss="modal">关&nbsp;&nbsp;&nbsp;&nbsp;闭</button>
																	</div>
																	<div class="col-xs-6 text-center">
																		<button type="submit" class="btn btn-primary">提&nbsp;&nbsp;&nbsp;&nbsp;交</button>
																	</div>
																</div>
															</div>
														</form>
													</div>
												</div>
											</div>
										</div>
									</div>
									<div class="col-xs-4">
										<h3 class="box-title">员工数据列表</h3>
									</div>
									<div class="col-xs-4">
										<button type="button" class="btn btn-block btn-info btn-flat" style="margin-bottom: 10px;" data-toggle="modal" data-target="#employee_upload">下载员工详细Excle/或批量添加员工</button>
										<div class="modal fade " id="employee_upload" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
											<div class="modal-dialog ">
												<div class="modal-content">
													<div class="modal-header">
														<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
														<h2>下载员工详细Excle/或批量添加员工：</h2>
													</div>
													<div class="modal-body">
														<div class="box-body">
															<p>下载员工详细Excle表功能介绍：直接筛选条件后，点击下载既可以完成</p>
															<p>批量添加员工介绍：先点击下载员工Excel模板，按照模板表格填写Excle表之后，再点击上传按钮， 上传已填写好的Excel文件(切勿上传其他格式文件)</p>
														</div>
														<div class="modal-footer">
															<form th:action="${#httpServletRequest.getContextPath()}+'/downloadEmployeeExcel'" method="post">
																<div class="row">
																	<div class="col-xs-3 text-center">
																		<label for="empGender">性别</label>
																		<div class="form-group">
																			<label>
																				<select class="form-control" name="empGender">
																						<option value="-1" selected="selected">---请选择-----</option>
																						<option value="1">男</option>
																						<option value="0">女</option>
																				</select>
																			</label>
																		</div>
																	</div>
																	<div class="col-xs-2 text-center">
																		<div class="form-group">
																			<label for="emp_degree">部门</label>
																				<select class="form-control" name="depuuid">
																					<option value="-1">---请选择---</option>
																					<option
																						th:each="department,departmentStat : ${dList}"
																						th:value="${department.depUuid}"
																						th:text="${department.depName}"></option>
																				</select>
																		</div>
																	</div>
																	<div class="col-xs-2 text-center">
																		<div class="form-group">
																			<label for="emp_age">年龄到</label>
																			<input type="text" class="form-control" name="empAge" placeholder="从1岁" />
																		</div>
																	</div>
																	<div class="col-xs-2 text-center">
																		<div class="form-group">
																			<label for="emp_age">年龄</label>
																			<input type="text" class="form-control" name="empAge1" placeholder="100岁之间" />
																		</div>
																	</div>
																	<div class="col-xs-3 text-center">
																		<label>学位</label>
																		<div class="form-group">
																			<label>
																				<select class="form-control" name="empDegree">
																						<option value="-1">---请选择---</option>
																						<option value="大专">大专</option>
																						<option value="本科">本科</option>
																						<option value="研究生">研究生</option>
																						<option value="博士">博士</option>
																						<option value="博士后">博士后</option>
																				</select>
																			</label>
																		</div>
																	</div>
																</div>
																<div class="row">
																	<input type="submit" value="下载员工详细Excle表" class="btn btn-block btn-info btn-flat" />
																</div>
															</form>
															<label></label>
															<label></label>
															<div class="row">
																<a th:href="${#httpServletRequest.getContextPath()}+'/downloadEmployeeExcel?template=1'" class="btn btn-block btn-info btn-flat">下载员工Excel模板</a>
															</div>
															<hr/>
															<form role="form" id="formExcel" th:action="${#httpServletRequest.getContextPath()}+'/readEmployeeExcel'" method="post" enctype="multipart/form-data">
																<div class="row">
																	<div class="col-xs-6 text-center" style="color: red">
																		批量添加员工(上传Excle表格添加员工)
																	</div>
																	<div class="col-xs-6 text-center"></div>
																</div>
																<label></label>
																<div class="row">
																	<div class="col-xs-6 text-center">
																		<input type="file" name="file" />
																		<span style="font-size: medium; color: #9e0505" id="exclespan"></span>
																	</div>
																	<div class="col-xs-6 text-center">
																		<button type="button" id="submitExcel" class="btn  btn-warning " style="margin-bottom: 10px;">提交文件</button>
																	</div>
																</div>
																<div class="row">
																	<span id="exclespan" style="font-size: medium; color: #9e0505"></span>
																</div>
															</form>
															<label></label>
															<label></label>
															<div class="row">
																<div class="col-xs-6 text-center">
																	<button type="reset" class="btn btn-warning" data-dismiss="modal">取&nbsp;&nbsp;&nbsp;&nbsp;消</button>
																</div>
																<div class="col-xs-6 text-center">
																	<a href="/employee/list" class="btn btn-primary">确&nbsp;&nbsp;&nbsp;&nbsp;认</a>
																</div>
															</div>
														</div>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
							<div class="box-body table-responsive">
								<table id="example2" class="table table-bordered table-striped ">
									<thead>
										<tr class="bg-green">
											<th>序号</th>
											<th>头像</th>
											<th>用户名</th>
											<th>姓名</th>
											<th>性别</th>
											<th>学位</th>
											<th>年龄</th>
											<th>电话</th>
											<th>邮箱</th>
											<th>地址</th>
											<th>部门</th>
											<th>是否激活</th>
											<th>操作</th>
										</tr>
									</thead>
									<tbody>
										<tr th:class="${employeeStat.index % 2 ==0}? '' : 'bg-gray'" th:each="employee,employeeStat : ${eList}">
											<td th:text="${employeeStat.index+1}"></td>
											<td>
												<div style="float: left; margin: 10px; overflow: hidden;">
													<img th:if="${employee.empPictures!=''}" class="lazy img-md" height="150px" width="200px" th:src="@{${#strings.append(pathfile,employee.empPictures)}}" />
												</div>
											</td>
											<td th:text="${employee.empUsername}"></td>
											<td th:text="${employee.empName}"></td>
											<td th:text="${employee.empGenderView}"></td>
											<td th:text="${employee.empDegree}"></td>
											<td th:text="${employee.empAge}"></td>
											<td th:text="${employee.empTele}"></td>
											<td th:text="${employee.empEmail}"></td>
											<td th:text="${employee.empAddress}"></td>
											<td th:text="${employee.department!=null} ? ${employee.department.depName} : '' "></td>
											<td>
												<span th:if="${employee.status==1}" class="fa fa-circle text-warning">未激活</span>
												<span th:if="${employee.status==2}" class="fa fa-circle text-success">已激活</span>
											</td>
											<td>&nbsp;&nbsp;&nbsp;&nbsp;
												<a href="javascript:void(0);" th:id="${employee.empUuid}" name="show" data-toggle="modal" data-target="#employee_add_and_update"class="fa fa-file btn btn-primary">详情</a>&nbsp;&nbsp;&nbsp;&nbsp;
												<a href="javascript:void(0);" th:id="${employee.empUuid}" data-toggle="tooltip" data-placement="top" data-original-title="删除后将无法恢复" class="fa fa-trash btn btn-primary example5-3-2">废除</a>
											</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
					</div>
				</div>
			</section>
		</div>
		<div th:replace="common/common_h5 :: down_foot"></div>
		<div th:replace="common/common_h5 :: down_sidebar"></div>
		<div class="control-sidebar-bg"></div>
		<div th:replace="common/common_resource :: common_js"></div>
		<script th:src="@{/admin_js/basics/employee_list.js}"></script>
</body>
</html>
